<template>
    <tr class="cart-item-del">
                <td class="text-center"><input @change="changeCheck(item.id,$event)" class="cart-check" type="checkbox" :checked="item.isCheck"/></td>
                <td class="text-center">
                  <span>
                    <img id="" class="cart-img img-rounded pic" :src="item.img" alt="cart">
                    <span class="cart-text">{{item.text}}</span>
                  </span>
                </td>
                <td class="text-center">
                  <span class="cart-price">{{item.price}}</span>
                </td>
                <td class="text-center">
                  <button @click="deleteItem" type="button" class="cart-reduce btn btn-info cart-reduce btn-sm">-</button>

                  <span class="cart-num border border-light ">{{item.num}}</span>

                  <button @click="addItem" type="button" class="cart-add btn btn-info cart-add btn-sm">+</button>
                </td>
                <td class="text-center"><span class="cart-subtotal">{{subTotal}}</span></td>
                <td class="text-center ">
                  <button @click="addBack" class="btn btn-info cart-add-single">添加</button></td> <!-- 这里不同 -->
              </tr>
</template>

<script>
export default {
  props:['item'],
    methods:{
       deleteItem(){
            this.$bus.$emit('deleteNewNum',this.item.id)
        },
        addItem(){
           this.$bus.$emit('addNewNum',this.item.id)
        },
        changeCheck(id,e){
           this.$bus.$emit('changeNewCheck',this.item.id,e.target.checked)
        },
        addBack(){
          this.$bus.$emit('deleteNewItem',this.item.id);
        }
        
    },
     computed:{
        subTotal(){
            return (this.item.price * this.item.num).toFixed(2);
        }
    }

};
</script>

<style scoped lang="css" scoped>
</style>
